<!DOCTYPE html>
<html>
<head>
    <title>交易明细</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link rel="stylesheet" href="${s.base}/mobile/css/jquery-weui.css">
    <link rel="stylesheet" href="${s.base}/mobile/css/weui.min.css">
    <link rel="stylesheet" href="${s.base}/mobile/css/base.css">
    <link rel="stylesheet" href="${s.base}/mobile/css/component.css">
    <link rel="stylesheet" href="${s.base}/mobile/css/orderDetail.css">
</head>
<body style="background: #f0eff4;">
<div class="xyg-head">
    <div class="xyg-tap">
        <div class="xyg-tap-item xyg-tap-item-select" id="showHz" data-type="1">回款|汇总</div>
        <div class="xyg-tap-item" id="showMx" data-type="2">交易|明细</div>
        <div class="clearBoth"></div>
    </div>
    <div class="xyg-select" style="display: none;">
        <div class="xyg-select-time">提交日期</div>
        <div class="xyg-select-input">
            <input type="text" id="date" readonly value="${nowDay}"/>
        </div>
        <div class="xyg-select-select">
            <input type="button" onclick="searchOrderCoupon()" value="查询"/>
        </div>
        <div class="clearBoth"></div>
    </div>
    <div class="cyt-top">
        <div class="cyt-top-item cyt-w1">回款时间</div>
        <div class="cyt-top-item cyt-w4">交易金额</div>
        <div class="cyt-top-item cyt-w2">数目</div>
        <div class="cyt-top-item cyt-w2">详情</div>
        <div class="clearBoth"></div>
    </div>
</div>
<div style="height:4.5rem;width:100%;"></div>

<!--内容开始-->
<div class="xyg-content" id="showContentHk">

</div>
<div class="xyg-content" id="showContentMx" style="display: none;">

</div>
<!--内容结束-->
</body>
<script src="${s.base}/mobile/js/jquery-2.1.4.js"></script>
<script src="${s.base}/mobile/js/jquery-weui.js"></script>
<script src="${s.base}/mobile/js/swiper.js"></script>
<script src="${s.base}/mobile/fonts/iconfont.js"></script>
<script src="${s.base}/mobile/js/component.js"></script>
<script src="${s.base}/mobile/js/base.js"></script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<!--js分享代码开始-->
<input type="hidden" value="${jSTicketShareResponse.appid}" id="appid" />
<input type="hidden" value="${jSTicketShareResponse.fxTitle}" id="fxTitle" />
<input type="hidden" value="${jSTicketShareResponse.fxImgUrl}" id="fxImgUrl" />
<input type="hidden" value="${jSTicketShareResponse.fxDesc}" id="fxDesc" />
<input type="hidden" value="${jSTicketShareResponse.fxUrl}" id="fxUrl" />
<input type="hidden" value="${jSTicketShareResponse.nonceStr}" id="nonceStr" />
<input type="hidden" value="${jSTicketShareResponse.timestamp}" id="timestamp" />
<input type="hidden" value="${jSTicketShareResponse.signature}" id="signature" />
<script src="${s.base}/mobile/js/share.js?322rre4433421"></script>
<!--js分享代码结束-->
<script type="application/javascript">
    // 两套分页，1汇总2明细
    var memberId = '${memberId}';
    var nowDay = '${nowDay}';
    var num=10;
    var loading = false;  //状态标记
    var pageStart=0;
    var searchType="1"

    var orderPageStart=0;

    $(document).ready(function () {
        $("#date").calendar({
            dateFormat: 'yyyy-mm-dd',
            onChange: function (p, values, displayValues) {
                // console.log(values);
                nowDay = values[0];
            }
        });
        $(".xyg-tap .xyg-tap-item").bind("click", function () {
            $(".xyg-tap .xyg-tap-item").removeClass("xyg-tap-item-select");
            $(this).addClass("xyg-tap-item-select");
            var type = $(this).attr("data-type");
            if (type == "1") {
                //回款
                showHk();
            } else {
                //交易明细
                showMx("");
            }
        });

        // 分页
        // sendOrderPost();
        startInfinite();
    });

    //启动下拉监听
    function startInfinite() {
        $(document.body).infinite();
        $(document.body).infinite().on("infinite", function() {
            if(loading) return;
            sendPost();
        });
        if(!loading){
            sendPost();
        }
    }

    function sendPost(){
        if(searchType=="1"){
            sendOrderPost();
        } else {
            sendOrderCouponPost();
        }
    }

    function sendOrderPost(){
        pageStart++;
        $.post("/phone/shopOrderJsonList",{
            pageSize : num,
            pageNum: pageStart,
            memberId:memberId
        },function(resultInfo){
            if (resultInfo.code == 0){
                var result = '';
                $("#showContentHk").html();
                if (resultInfo.data!=null && resultInfo.data.length > 0){
                    for(var i=0;i<resultInfo.data.length;i++){
                        var shopOrder = resultInfo.data[i];
                        var createDay = new Date(shopOrder.createTime).format("yyyy-MM-dd");
                        var content = '<div class="cyt-content-item">\
                            <div class="cyt-content-item-title cyt-w1">'+new Date(shopOrder.createTime).format("yyyy-MM-dd HH:mm:ss")+'</div>\
                        <div class="cyt-content-item-title cyt-w5">￥'+shopOrder.money+'</div>\
                        <div class="cyt-content-item-title cyt-w3">'+shopOrder.num+'</div>\
                            <div class="cyt-content-item-title cyt-w3">\
                            <a href="javascript:void(0)" onclick="searchOrderCouponByDay(\''+createDay+'\')">查看</a>\
                            </div>\
                            <div class="clearBoth"></div>\
                            </div>';

                        $("#showContentHk").append(content);
                        loading = false;
                        if(!resultInfo.hasNextPage){
                            $(document.body).destroyInfinite();
                        }
                    }
                }else{
                    $(".xyg-index").hide();
                    $(".xyg-jskf").show();
                }
            }
        },"json");
    }

    function sendOrderCouponPost(){
        orderPageStart++;
        $.post("/phone/shopOrderCouponRightJsonList",{
            pageSize : num,
            pageNum: orderPageStart,
            nowDay:nowDay,
            memberId:memberId
        },function(resultInfo){
            if (resultInfo.code == 0){
                var result = '';
                $("#showContentMx").html();
                if (resultInfo.data!=null && resultInfo.data.length > 0){
                    for(var i=0;i<resultInfo.data.length;i++){
                        var shopOrderCoupon = resultInfo.data[i];
                        // 备注
                        var cashMessageStr = "无";
                        if (shopOrderCoupon.cashMessage != null && shopOrderCoupon.cashMessage != "") {
                            cashMessageStr = shopOrderCoupon.cashMessage;
                        }
                        // 打款是否成功
                        var cashStatusStr = "未付现";
                        if (shopOrderCoupon.cashStatus != null && shopOrderCoupon.cashStatus != "" && shopOrderCoupon.cashStatus == "2") {
                            cashStatusStr = "已付现";
                        }
                        var content = '<div class="xyg-list-item">\
                            <div class="xyg-list-item-left">权益类型</div>\
                            <div class="xyg-list-item-right">'+shopOrderCoupon.itemName+'[￥'+shopOrderCoupon.price+']</div>\
                            <div class="xyg-list-item-left">卷码</div>\
                            <div class="xyg-list-item-right">'+shopOrderCoupon.qrImage+'</div>\
                            <div class="xyg-list-item-left">提交日期</div>\
                            <div class="xyg-list-item-right">'+new Date(shopOrderCoupon.createTime).format("yyyy-MM-dd HH:mm:ss")+'</div>\
                            <div class="xyg-list-item-left">支付宝</div>\
                            <div class="xyg-list-item-right">'+shopOrderCoupon.memberAlipay+'</div>\
                            <div class="xyg-list-item-left">银行</div>\
                            <div class="xyg-list-item-right">'+shopOrderCoupon.memberBankCard+'</div>\
                            <div class="xyg-list-item-left">状态</div>\
                            <div class="xyg-list-item-right">'+cashStatusStr+'</div>\
                            <div class="xyg-list-item-left">备注</div>\
                            <div class="xyg-list-item-right">'+cashMessageStr+'</div>\
                            <div class="clearBoth"></div>\
                            </div>';

                        $("#showContentMx").append(content);
                        loading = false;
                        if(!resultInfo.hasNextPage){
                            $(document.body).destroyInfinite();
                        }
                    }
                }else{
                    $(".xyg-index").hide();
                    $(".xyg-jskf").show();
                }
            }
        },"json");
    }

    //设置回款
    function showHk() {
        $(".cyt-top").show();
        $(".xyg-select").hide();
        $("#showContentHk").show();
        $("#showContentMx").hide();
        // 这边是分页
        pageStart=0;
        searchType="1";
        $("#showContentHk").html("");
        sendOrderPost();
    }

    //设置明细
    function showMx(dateStr) {
        $(".cyt-top").hide();
        $(".xyg-select").show();
        $("#showContentMx").show();
        $("#showContentHk").hide();
        // 查询出详情
        orderPageStart=0;
        searchType="2";
        $("#showContentMx").html("");
        sendOrderCouponPost();
    }

    function searchOrderCoupon(){
        // 更改天
        showMx("");
    }

    function searchOrderCouponByDay(day){
        nowDay = day;
        $(".xyg-tap .xyg-tap-item").removeClass("xyg-tap-item-select");
        $("#showMx").addClass("xyg-tap-item-select");
        $("#date").val(day);
        showMx("");
    }
</script>
</html>

